<template>
	<view class="mainpadding">
		<view class="xiaolan titletext bold" v-show="dataAll.status==20">司机已接单</view>
		<view class="xiaolan titletext bold" v-show="dataAll.status==30">进行中</view>
		<view class="xiaohong titletext bold" v-show="dataAll.status==40">待确认</view>
		<view class="xiaolv titletext bold" v-show="dataAll.status==50">已完成</view>
		<view class="mainpadding_top ffffff radius" v-if="dataAll.type==4">
			<view class="titletext hei_text bold">上车地点</view>
			<view class="margin_top hui_text main_size bold">{{dataAll.start_address}}</view>
		</view>
		<view class="mainpadding_top ffffff radius" v-if="dataAll.type==4">
			<view class="titletext hei_text bold">下车地点</view>
			<view class="margin_top hui_text main_size bold">{{dataAll.end_address}}</view>
		</view>
		<template v-if="dataAll.type!=2 && dataAll.user">
			<view class="mainpadding_top ffffff radius flexbetween"  @click="phone(dataAll.user.mobile)">
				<view class="titletext hei_text bold">乘客电话：{{dataAll.user.mobile}}</view>
				<u-icon name="phone" size="20" color="#3478f5"></u-icon>
			</view>
		</template>
		<view class="mainpadding_top ffffff radius flexbetween" v-if="dataAll.type==2" @click="phone(dataAll.ccr_mobile)">
			<view class="titletext hei_text bold">乘客电话：{{dataAll.ccr_mobile}}</view>
			<u-icon name="phone" size="20" color="#3478f5"></u-icon>
		</view>
		<view class="mainpadding_top ffffff radius">
			<view class="titletext hei_text bold">订单信息</view>
			<view class="flexbetween margin_top">
				<view class="hei_text bold main_size">订单编号</view>
				<view class="xiaohui">{{dataAll.order_no}}</view>
			</view>
			<view class="flexbetween margin_top">
				<view class="hei_text bold main_size">创建时间</view>
				<view class="xiaohui">{{dataAll.createtime_text}}</view>
			</view>
			<view class="flexbetween margin_top" v-if="dataAll.type==4">
				<view class="hei_text bold main_size">出发时间</view>
				<view class="xiaohui">{{dataAll.cf_time}}</view>
			</view>
			<view class="flexbetween margin_top" v-if="dataAll.type==4">
				<view class="hei_text bold main_size">需要座位</view>
				<view class="xiaohui">{{dataAll.zw_num}}</view>
			</view>
			<view class="flexbetween margin_top" v-show="dataAll.status==50">
				<view class="hei_text bold main_size">订单金额</view>
				<view class="xiaolan">￥{{dataAll.pay_price}}</view>
			</view>
			<view class="flexbetween margin_top" v-show="dataAll.status==50">
				<view class="hei_text bold main_size">优惠</view>
				<view class="xiaolan">￥{{dataAll.coupon_price}}</view>
			</view>
			<view class="flexbetween margin_top" v-if="dataAll.status==40 || dataAll.status==50">
				<view class="hei_text bold main_size">行车时长</view>
				<view class="xiaohui">{{dataAll.sc_text}}</view>
			</view>
		</view>
		<u-modal :show="Payshow" title="支付" showCancelButton @cancel="Payshow = false" @confirm="linexiaPay">
			<view class="slot-content">
				<view class="mainpadding_top">
					<view class="flexbetween flexrow">
						<view class="lan_text bold main_size">支付金额</view>
						<input type="number" class="hei_text bold titletext" placeholder="请输入支付金额"
							style="text-align: right;" v-model="pay_price">
					</view>
					<view class="flexbetween margin_top6 flexrow" @click="xuanzeyh">
						<view class="lan_text bold main_size">选择优惠券</view>
						<view class="flexright flexrow">
							<view class="hei_text bold titletext">{{coupon_name}}</view>
							<u-icon name="arrow-right" size="16" color="#333"></u-icon>
						</view>
					</view>
				</view>
			</view>
		</u-modal>
		<u-popup :show="couponShow" closeable @close="couponShow = false" round="10">
			<view class="mainpadding_top">
				<view class="titletext bold hei_text" style="text-align: center;">选择优惠券</view>
				<scroll-view scroll-y="true" style="height: 500rpx;" class="margin_top">
					<view class="bglan mainpadding_top radius titletext bold bai_text" v-for="item in couponlist"
						:key="item.coupon_id" @click="checkcoupon(item)">
						<view class="">{{item.name}}</view>
						<view class="xiaobai margin_top">到期时间：{{item.end_time_text}}</view>
					</view>
				</scroll-view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")
	export default {
		data() {
			return {
				listid:"",
				dataAll:{},
				Payshow: false,
				pay_price: "",
				couponShow: false,
				couponlist: [],
				coupon_name: "",
			}
		},
		onLoad(options) {
			this.listid = options.id
			this.init()
		},
		watch: {
			pay_price(newval) {
				if (this.pay_price == "") {
					return false
				}
				this.getcoupon()
			}
		},
		methods: {
			init() { //用户信息
				httpRequest.request('/api/order/detail', 'GET', {
					id:this.listid
				}, false, false, true).then(res => {
					if (res.code == 1) {
						this.dataAll = res.data
					}
				}).catch(err => {
					httpRequest.toast(err.msg);
				})
			},
			getcoupon() { //获取优惠券
				httpRequest.request('/api/user/userCoupon', 'GET', {
					pay_price: this.pay_price
				}, false, false, true).then(res => {
					this.couponlist = res.data
				}).catch(err => {
					httpRequest.toast(err.msg);
				})
			},
			xuanzeyh() {
				if (this.pay_price == "") {
					httpRequest.toast("请输入支付金额")
					return
				}
				if (!this.couponlist.length) {
					httpRequest.toast("暂无可用优惠券")
					return
				}
				this.couponShow = true
			},
			checkcoupon(item) { //选择优惠券
				this.coupon_id = item.coupon_id
				this.coupon_name = item.name
				this.couponShow = false
			},
			linexiaPay() {
				this.Payshow = false
				httpRequest.request('/api/order/editPayPrice', 'GET', {
					pay_price: this.pay_price,
					pay_type: this.pay_type,
					id: this.listid,
					coupon_id: this.coupon_id
				}, false, false, true).then(res => {
					if (res.code == 1) {
						if (this.pay_type == 20) {
							httpRequest.toast(res.msg);
							setTimeout(() => {
								uni.navigateBack(1)
							}, 1000)
						}
					}
				}).catch(err => {
					httpRequest.toast(err.msg);
				})
			},
			phone(p) {
				uni.makePhoneCall({
					phoneNumber: p.toString()
				}).catch((e) => {})
			},
		}
	}
</script>

<style scoped>
.bglan {
		background-color: #3478f5;
	}
</style>
